<template>
    <div>
        <p>
            <!-- <input type="text" :value="formData.name" @input="handleInput"> -->
            <input type="text" v-model="formData.name" @change="handleChange">
        </p>
        <p>{{ formData.name }}</p>
        <p>age: {{ formData.age }}</p>
    </div>
</template>

<script setup>
// const props = defineProps(['formData']);
// const emit = defineEmits('update:formData');

const formData = defineModel('formData');

// const handleInput = (e) => {
    // console.log('val', e.target.value);
    // const value = e.target.value;
    // emit('update:formData', Object.assign(props.formData, {name: value}));
// };

const handleChange = () => {
    // formData.value = Object.assign(formData.value, {name: '123456'});
    formData.value.name = '12345';
    formData.value.age = 10;
};
</script>

<style lang="scss" scoped></style>